<template>
  <div class="transQuery_main">
    <h3>撤销记录</h3>

    <a-table
      size="middle"
      :scroll="{ y: '38vh' }"
      :columns="columns"
      :dataSource="list"
      :pagination="false"
      :rowKey="record => record.code + Math.random(10000)"
    >
      <!-- <span slot="transTime" slot-scope="record">{{record.transTime | timeFilter}}</span>
      <span slot="amount" slot-scope="record">{{(record.amount/100).toFixed(2)}}</span>
      <span slot="action" slot-scope="record">
        <span @click="goDetail(record.transOrderNo)" style="color:#1890ff;">详细</span>
      </span>-->
    </a-table>

    <a-pagination
      @change="onPageChange"
      :current="pagination.current"
      :total="pagination.total"
      :pageSize="query.pageSize"
      style="margin-top: 20px"
    />
    <a-button style="margin-top:15px;" @click="backTransList">
      <a-icon type="double-left" />返回
    </a-button>
  </div>
</template>

<script>
import AForm from "ant-design-vue/es/form/Form";
import ATabs from "ant-design-vue/es/tabs";
import AFormItem from "ant-design-vue/es/form/FormItem";
import AInput from "ant-design-vue/es/input/Input";
import AIcon from "ant-design-vue/es/icon";
import AInputGroup from "ant-design-vue/es/input/Group";
import AButton from "ant-design-vue/es/button/button";
import ACol from "ant-design-vue/es/grid/Col";
import ARow from "ant-design-vue/es/grid/Row";
import ACheckbox from "ant-design-vue/es/checkbox/Checkbox";
import AAlert from "ant-design-vue/es/alert/index";
import moment from "moment";
import api from "@/common/api";
const ATabPane = ATabs.TabPane;

const columns = [
  {
    title: "操作时间",
    dataIndex: "ctime",
    width: "50%",
    align: "center"
  },

  {
    title: "SN设备号",
    dataIndex: "code",
    width: "50%",
    align: "center"
  }
  // { title: "下级合作机构号", dataIndex: "statusName", width: '12%', align: 'center' },
  // { title: "下级合作机构名称", scopedSlots: { customRender: "action" }, width: '10%', align: 'center' }
];

export default {
  name: "Login",

  components: {
    AAlert,
    ACheckbox,
    ACol,
    ARow,
    AButton,
    AInputGroup,
    AIcon,
    AInput,
    AFormItem,
    ATabPane,
    ATabs,
    AForm
  },

  data() {
    return {
      form: this.$form.createForm(this),
      today: new Date(),
      columns,
      isClear: false,
      momentDate: moment(new Date()),
      excelurl: "",
      statusList: [],
      SettleStatusList: [],
      transTypeList: [],
      query: {
        page: 1,
        pageSize: 10,
        data: {
          subjectId: ""
        }
      },
      pagination: { current: null, total: null },
      visible: false,
      form: this.$form.createForm(this),
      error: "",
      loginpwd: "",
      loginpwd2: "",
      login: false,
      list: [
        {
          transTime: "",
          transOrderNo: "134354235425"
        }
      ],
      count: null,
      payedCount: null,
      totalAmount: null,
      loading: false,
      RelieveVisible: false,
      formItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 8 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 14, offset: 1 },
          md: { span: 14, offset: 1 }
        }
      }
    };
  },

  watch: {},

  filters: {
    timeFilter: function(value) {
      if (value) {
        let year = value.substring(0, 2);
        let mouth = value.substring(2, 4);
        let day = value.substring(4, 6);
        return year + ":" + mouth + ":" + day;
      }
    }
  },

  computed: {},

  created() {},

  mounted() {
    this.query.data.subjectId = this.$route.params.id;
    this.handleSearch();
  },

  methods: {
    moment,

    onPageChange: function(page, pageSize) {
      console.info(page, pageSize);
      this.query.page = page;
      this.query.pageSize = pageSize;
      this.handleSearch();
    },

    sureClose() {},

    handleOk(e) {
      setTimeout(() => {
        this.RelieveVisible = false;
      }, 2000);
    },

    RelieveTerminal() {
      this.RelieveVisible = true;
    },

    handleCancelRelieve(e) {
      this.RelieveVisible = false;
    },
    handleInput(e) {
      e.preventDefault();
      this.RelieveVisible = true;
      this.form.validateFields((err, values) => {
        console.log("values", values);
      });
    },
    backTransList() {
      this.$router.push("/marketing/customActivity");
    },
    handleSearch() {
      this.loading = true;
      console.info(this.query);
      api.revokeLogList(this.query, res => {
        console.info(res);
        if (res.code == "OK") {
          this.loading = false;
          this.list = res.list;
          //   this.list.forEach(function(item) {
          //     item.amount = item.amount.toFixed(2);
          //   });
          this.pagination.current = res.current;
          this.pagination.total = res.total;
          // this.count = res.total; //总笔数
          // this.payedCount = res.payedCount; //成功笔数
          // this.totalAmount = res.totalAmount.toFixed(2); //总金额
        } else {
          this.loading = false;
          // this.$message.info(res.message)
          this.list = [];
          this.pagination.current = 1;
          this.pagination.total = 1;
          return false;
        }
      });
    }
  }
};
</script>

<style lang="less" scoped>
span {
  cursor: pointer;
}

span {
  cursor: pointer;
}

.formGroupTitle {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
}

.ant-tabs-nav {
  float: right;
}

.amountColor {
  color: #29a576;
  font-weight: 400;
}

.amountSize {
  font-size: 20px;
  padding: 0 5px;
}

.expand {
  display: flex;
  align-items: center;
  justify-content: center;
}

.transQuery_main {
  padding: 40px 70px;
}

.button_sty {
  width: 100%;
}

.modalClass {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-top: 40px;
  padding-bottom: 20px;
}

.modalClass span {
  font-size: 17px;
  font-weight: 400;
  margin-top: 5px;
  margin-bottom: 5px;
}

.modalClass p {
  margin-bottom: 10px;
}

.footClass {
  width: 60%;
  display: flex;
  justify-content: space-around;
  margin-top: 20px;
}
</style>